<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<link rel="stylesheet" href="../../../layuiadmin/layui/css/layui.css" media="all">
		<link rel="stylesheet" href="../../../layuiadmin/style/admin.css" media="all">
		<link rel="stylesheet" href="../../../css/common.css" media="all">
		<style type="text/css">
			.layui-upload-list {
				display: flex;
			}
			
			.layui-upload-list>div {
				width: 20%;
				height: 100px;
			}
			
			.layui-upload-list>div>img {
				width: 100%;
				height: 100%;
			}
		</style>
	</head>

	<body>

		<div class="layui-fluid">
			<div class="layui-row layui-col-space15">
				<div class="layui-card">
					<form class="layui-form" lay-filter='example' onsubmit="return false" action="##" id="form">
						<div class="layui-form-item">
							<label class="layui-form-label">文件上传：</label>
							<button type="button" class="layui-btn" id="test2">选择文件上传</button>
							<blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
								预览图：
								<div class="layui-upload-list" id="demo2"></div>
							</blockquote>
							<!-- <button type="button" class="layui-btn layui-btn-normal" id="choose">选择文件上传</button> -->
							<!-- <button type="button" class="layui-btn" id="up">开始上传</button> -->
						</div>
						<div class="layui-form-item layui-layout-admin">
							<div class="layui-input-block">
								<div class="layui-footer" style="left: 0;">
									<button class="layui-btn" id="queding">确定</button>
								</div>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>

		<script src="../../../layuiadmin/layui/layui.js"></script>
		<script src="../../../js/jquery.min.js"></script>
		<script src="../../../js/jquery.jqprint-0.3.js"></script>
		<script src="../../../js/common.js"></script>
		<script>
			var _data = {
				type: getParam('type')
			}

			layui.config({
				base: '../../../layuiadmin/' //静态资源所在路径
			}).extend({
				index: 'lib/index' //主入口模块
			}).use(['index', 'form', 'upload'], function() {
				var $ = layui.$,
					admin = layui.admin,
					upload = layui.upload,
					form = layui.form;

				var img_arr = [];

				//多图片上传
				if(_data.type == 1 ||  _data.type == 3||  _data.type == 2) {
					var index1 = null;
					upload.render({
						elem: '#test2',
						url: server.upimg,
						multiple: true,
						before: function(obj) {
							index1 = layer.load(1, {
								shade: [0.1, '#fff'] //0.1透明度的白色背景
							});
							//预读本地文件示例，不支持ie8
							obj.preview(function(index, file, result) {
								$('#demo2').append('<div><img src="' + result + '" alt="' + file.name + '" class="layui-upload-img"></div>')
							});
						},
						done: function(res) {
							//上传完毕
							img_arr.push(res.file);
							if(res.file) {
								layer.msg('上传完毕');
								layer.close(index1);
							}
							// console.log(res.file);
						}
					});
				} else {
					upload.render({
						elem: '#test2',
						url: server.upimg,
						accept: 'video',
						multiple: true,
						before: function(obj) {
							//预读本地文件示例，不支持ie8
							var index = layer.load(1, {
								shade: [0.1, '#fff'] //0.1透明度的白色背景
							});
							obj.preview(function(index, file, result) {
								$('#demo2').append('<div><video src="' + result + '" alt="' + file.name + '" style="width: 100%;height:100%"></video></div>')
							});
						},
						done: function(res) {
							//上传完毕
							layer.msg('上传成功')
							img_arr.push(res.file);
							closeloading()
							// console.log(res.file);
						}
					});
				}

				//选完文件后不自动上传
				/* upload.render({
					elem: '#choose',
					url: server.upimg,
					auto: false,
					bindAction: '#up',
					accept: 'file',
					before: function() {
						loading();
					},
					done: function(res) {
						console.log(res)
						if (res.file) {
							layer.msg('上传成功');
							parent.getimg(res.file);
							var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
							parent.layer.close(index); //再执行关闭
							closeloading();
						}
					}
				}); */
				$('#queding').on('click', function() {
					parent.getimg(img_arr.join(','), _data.type);
					var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
					parent.layer.close(index); //再执行关闭
				});

				//监听提交
				form.on('submit(demo1)', function(data) {
					console.log(data.field);
					_data.report_pic = data.field.report_pic;
					_data.report_content = data.field.report_content;
					layer.confirm('确定保存？', function() {
						submitdata();
					}, function() {
						layer.msg('取消操作');
					});
					return false;
				});

				// initdata();

				function submitdata() {
					$.post(server.updatereport, _data, function(res, status) {
						if(status == 'success') {
							if(res.code == 0) {
								layer.msg('保存成功', {
									time: 200
								}, function() {
									parent.layer.closeAll();
								});
							} else {
								layer.msg(res.msg);
							}
						} else {
							layer.msg('服务器连接错误');
						}
					});
				}

				function initdata() {
					$.get(server.queryreportdetail, _data, function(res, status) {
						if(status == 'success') {
							if(res.code == 0) {
								var data = res.orders_test.data
								$('input[name=report_pic]').val(data.report_pic);
								$('textarea[name=report_content]').val(data.report_content);
							} else {
								layer.msg(res.msg);
							}
						} else {
							layer.msg('服务器连接错误');
						}
					});
				}
			});
		</script>
	</body>

</html>